<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<!--首页-->
<head>
    <meta charset="UTF-8"/>
    <title>后台管理系统</title>

    <link rel="stylesheet" type="text/css" href="/esayui/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/esayui/themes/icon.css">
    <!--<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>-->
    <script type="text/javascript" src="/esayui/jquery.min.js"></script>
    <script type="text/javascript" src="/esayui/jquery.easyui.min.js"></script>

    <script type="text/javascript" src="/webuploader/webuploader.js"></script>
    <script type="text/javascript" src="/esayui/datagrid-detailview.js"></script>

    <style>
        li{list-style: none;}
    </style>
</head>
<body class="easyui-layout">

<div data-options="region:'north',border:false" style="height:60px;background:#A9FACD;padding:10px">
    <span style="font-size: large">后台管理系统</span>
</div>
<div data-options="region:'west',split:true,title:'West'" style="width:200px;padding:10px;">
    <div class="easyui-accordion" style="width:180px;">
        <div title="基本信息管理" data-options="iconCls:'icon-ok'" style="overflow:auto;padding:10px;">
            <ul>
                <li>
                    <a href="javascript:addAttrTabs();">平台属性管理</a>
                </li>
            </ul>
        </div>
        <div title="商品信息管理" data-options="iconCls:'icon-ok'" style="padding:10px;">
            <ul>
                <li>
                    <a href="javascript:addSupTabs();">商品SPU管理</a>
                </li>
            </ul>
        </div>
        <div title="广告管理" data-options="iconCls:'icon-ok'" style="padding:10px;">
            <ul>
                <li>
                    <a href="javascript:addOtherTabs();">其他管理项</a>

                </li>
            </ul>
        </div>
    </div>

</div>
<div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>
<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;"></div>
<div data-options="region:'center',title:'Center'">
    <div id="tt" class="easyui-tabs" style="width: 100%;height: 100%;"></div>
</div>

<script language="JavaScript">


    //在Center中的tabs中返回attrListPage页面
    function addAttrTabs() {
        var tab = $("#tt").tabs("exists", "属性信息管理");
        //如果tab不存在则加载
        if (!tab) {
            $("#tt").tabs("add", {
                title: "属性信息管理",
                href: "attrListPage",
                closable: true
            });
        }
        //否则定位到已加载的tab上
        else {
            $("#tt").tabs("select", "属性信息管理");
        }

    }


    //在Center中的tabs中返回spuListPage页面
    function addSupTabs() {
        var tab = $("#tt").tabs("exists", "商品SPU管理");
        //如果tab不存在则加载
        if (!tab) {
            $("#tt").tabs("add", {
                title: "商品SPU管理",
                href: "spuListPage",
                closable: true
            });
        }
        //否则定位到已加载的tab上
        else {
            $("#tt").tabs("select", "商品SPU管理");
        }

    }

</script>

</body>
</html>